{include file="public/header" /}
<link rel="stylesheet" href="/static/admin/addons/builderPlus/css/base.css" media="all">
<style>
    html {
        background-color: #f2f2f2 !important;
    }
    .layui-row .layui-card {
        background-color: #ff5722;
        color: #fff;
        border-radius: 5px
    }

    .layui-row .layui-card .layui-card-header {
        color: #fff
    }

    .layui-row .child {
        padding: 10px;
        cursor: pointer;
        font-size: 12px;
    }

    .parent-first {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
    }

    .layui-row .child-x {
        padding: 0;
    }

    .parent {
        padding-top: 10px;
    }

    .box {
        width: 2px;
        height: 120px;

        background-color: #333;
    }

    .red {
        background-color: #ff5722 !important;
    }

    .orange {
        background-color: #ffb800 !important;
    }

    .green {
        background-color: #16baaa !important;
    }

    .blue {
        background-color: #1e9fff !important;
    }

    .purple {
        background-color: #a233c6 !important;
    }

    .purple {
        background-color: #a233c6 !important;
    }

    .deep {
        background-color: #2f363c !important;
    }

    .layui-col-xs2 {
        width: 20% !important;
    }
</style>
<body>
<div class="layui-fluid layui-anim layui-anim-upbit">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item">
                <div class="nav_search" style="float: right">
                    <div style="padding-right: 10px">
                        <button type="button" class="layui-btn layui-btn-sm {$color[1]}">未激活</button>
                        <button type="button" class="layui-btn layui-btn-sm {$color[2]}">已激活</button>
                    </div>
                    <form class="layui-form">
                        <div class="layui-inline">
                            <input class="layui-input" placeholder="会员编号/昵称/手机号筛选" name="keyword"
                                   value="<?php echo request()->param('keyword');?>">
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn layuiadmin-btn-useradmin layui-btn-sm" lay-submit="" lay-filter="sreach">搜索</button>
                            {if ($Request.param.keyword || $Request.param.id) && $first && $first.id != 1}
                            <a href="{:url('index')}?id={$first.node_id}" class="layui-btn layui-btn-danger2 layui-btn-sm">上一层</a>
                            <a href="{:url('index')}" class="layui-btn layui-btn-danger layui-btn-sm">重置</a>
                            {/if}
                        </div>
                    </form>
                </div>
            </div>
        </div>
        {if $first}
        <div style="display: flex;align-items: center;justify-content: center;padding: 20px">
            <div class="layui-card-body" style="width: 1400px; ">
                <div class="layui-row parent-first">
                    <div class="layui-col-xs2">
                        <div class="layui-card {$color[$first.is_active]}">
                            <div class="layui-card-header">{$first.code}</div>
                            <div class="layui-card-body">
                                <p>昵称：{$first.nickname}</p>
                                <p>手机号：{$first.mobile}</p>
                                <p>激活时间：{$first.active_time}</p>
                                <p>会员等级：{$first.level?$first.level.title:'无'}</p>
                                <p>{:getNodePosition(1)}人数：{$first.num_1}</p>
                                <p>{:getNodePosition(2)}人数：{$first.num_2}</p>
                                <p>{:getNodePosition(1)}业绩：{$first.total_1}</p>
                                <p>{:getNodePosition(2)}业绩：{$first.total_2}</p>
                                <p>{:getNodePosition(1)}结余：{$first.surplus_1}</p>
                                <p>{:getNodePosition(2)}结余：{$first.surplus_2}</p>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-row" style="display: flex;align-items: center;justify-content: center;margin-bottom: -10px">
                    <p class="box" style="transform: skew(0deg);height:80px"></p>
                </div>
                <div class="layui-row" style="display: flex;align-items: center;justify-content: center;">
                    <div class="layui-col-xs10" style="width: 47%;">
                        <hr class="layui-border-black" style="background-color: #333;height: 2px">
                    </div>
                </div>
                <div class="layui-row" style="margin-top: -13px;">
                    <div class="layui-col-xs6 child-x" style="display: flex;align-items: center;justify-content: center">
                        <p class="box" style="transform: skew(-20deg);"></p>
                    </div>
                    <div class="layui-col-xs6 child-x" style="display: flex;align-items: center;justify-content: center">
                        <p class="box" style="transform: skew(20deg);"></p>
                    </div>
                </div>

                <div class="layui-row parent">
                    {foreach name="child" item="vo"}
                    {if !empty($vo.id)}
                    <div class="layui-col-xs6 child">
                        <div class="layui-card {$color[$vo.is_active]}" onclick="location.href='{:url(\'index\')}?id={$vo.id}'" style="width: 40%;margin-left: 30%;">
                            <div class="layui-card-header">{$vo.code}</div>
                            <div class="layui-card-body">
                                <p>昵称：{$vo.nickname}</p>
                                <p>手机号：{$vo.mobile}</p>
                                <p>激活时间：{$vo.active_time}</p>
                                <p>会员等级：{$vo.level?$vo.level.title:'无'}</p>
                                <p>{:getNodePosition(1)}人数：{$vo.num_1}</p>
                                <p>{:getNodePosition(2)}人数：{$vo.num_2}</p>
                                <p>{:getNodePosition(1)}业绩：{$vo.total_1}</p>
                                <p>{:getNodePosition(2)}业绩：{$vo.total_2}</p>
                                <p>{:getNodePosition(1)}结余：{$vo.surplus_1}</p>
                                <p>{:getNodePosition(2)}结余：{$vo.surplus_2}</p>
                            </div>
                        </div>
                        <div class="layui-row" style="display: flex;align-items: center;justify-content: center;margin-bottom: -10px">
                            <p class="box" style="transform: skew(0deg);height:80px"></p>
                        </div>
                        <div class="layui-row" style="display: flex;align-items: center;justify-content: center;">
                            <div class="layui-col-xs10" style="width: 47%;">
                                <hr class="layui-border-black" style="background-color: #333;height: 2px">
                            </div>
                        </div>
                        <div class="layui-row" style="margin-top: -13px;">
                            <div class="layui-col-xs6 child-x" style="display: flex;align-items: center;justify-content: center">
                                <p class="box" style="transform: skew(-20deg);"></p>
                            </div>
                            <div class="layui-col-xs6 child-x" style="display: flex;align-items: center;justify-content: center">
                                <p class="box" style="transform: skew(20deg);"></p>
                            </div>
                        </div>
                        {foreach name="vo.child" item="v"}
                        {if !empty($v)}
                        <div class="layui-col-xs6 child">
                            <div class="layui-card {$color[$v.is_active]}" onclick="location.href='{:url(\'index\')}?id={$v.id}'">
                                <div class="layui-card-header">{$v.code}</div>
                                <div class="layui-card-body">
                                    <p>昵称：{$v.nickname}</p>
                                    <p>手机号：{$v.mobile}</p>
                                    <p>激活时间：{$v.active_time?$v.active_time:'未激活'}</p>
                                    <p>会员等级：{$v.level?$v.level.title:'无'}</p>
                                    <p>{:getNodePosition(1)}人数：{$v.num_1}</p>
                                    <p>{:getNodePosition(2)}人数：{$v.num_2}</p>
                                    <p>{:getNodePosition(1)}业绩：{$v.total_1}</p>
                                    <p>{:getNodePosition(2)}业绩：{$v.total_2}</p>
                                    <p>{:getNodePosition(1)}结余：{$v.surplus_1}</p>
                                    <p>{:getNodePosition(2)}结余：{$v.surplus_2}</p>
                                </div>
                            </div>
                        </div>
                        {else}
                        <div class="layui-col-xs6 child">
                            <div class="layui-card">
                                <div class="layui-card-header" style="background-color: silver">空位</div>
                            </div>
                        </div>
                        {/if}
                        {/foreach}
                    </div>
                    {else}
                    <div class="layui-col-xs6 child">
                        <div class="layui-card" style="width: 40%;margin-left: 30%;">
                            <div class="layui-card-header" style="background-color: silver">空位</div>
                        </div>
                    </div>
                    {/if}
                    {/foreach}
                </div>
            </div>
        </div>
        {else}
        <div class="layui-row" style="display: flex;align-items: center;justify-content: center;padding: 20px">
            <h3><i class="layui-icon layui-icon-face-cry" style="font-size: 1.3rem !important;"></i> 暂无数据</h3>
        </div>
        {/if}
    </div>
</div>
</body>
{include file="public/footer" /}
</html>